<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=1">
    <title>DIMENSIONAL RIFT</title>

    <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@500&amp;family=Poppins:wght@500&amp;display=swap" rel="stylesheet">
    <link charset="UTF-8" href="../css/common/common.css" rel="stylesheet">
    <link charset="UTF-8" href="./rift.css" rel="stylesheet">
    <link rel="icon" href="../img/icon.ico">
    <script async="" src="https://www.google-analytics.com/analytics.js"></script>
    <script src="../js/jquery/jquery.min.js"></script>
    <script src="../js/jquery/jquery.easing.compatibility.js"></script>
    <script src="../js/jquery/jquery.easing.min.js"></script>

    <script src="../js/three/three.min.js"></script>
    <script src="../js/utils/stats.min.js"></script>
    <script src="../js/utils/delaunay.js"></script>
    <script src="../js/utils/utils.js"></script>
    <script src="../js/common/common.js"></script>

    <link rel="stylesheet" href="../css/colorpicker/colorpicker.css">
    <script src="../js/colorpicker/colorpicker.js"></script>
    <!-- test -->
    <script src="../js/utils/dat.gui.min.js"></script>
    <script src="./rift.js"></script>
    <style>

    </style>
</head>

<body id="kips">
    <div id="loading_bar">
    </div>
    <p class="noselect" id="error_text"></p>
    <div id="game_panel">
        <div id="three_root" class="noselect"></div>
        <canvas id="canvas" class="noselect"></canvas>
        <video id="video" src(unknow)></video>
        <div class="bt" id="bt_edit">
            <img src="./tex/edit.png" alt="">
        </div>
        <div id="edit_panel">
            <div class="edit_bt" id="first"><img id="bt_hide_edit" src="./tex/edit.png"></div>
            <div class="edit_bt" id="second"><img id="bt_eyedropper" src="./tex/eyedropper_normal.png"></div>
            <div class="edit_bt" id="third">
                <div id="color_disk"></div>
            </div>
            <div class="edit_bt" id="last">
                <div id="cd_wrapper">
                    <div id="cd_slider"></div>
                </div>
            </div>
        </div>
    </div>
    <div class="bt" id="bt_full">
        <img src="./tex/full_screen.png" alt="">
    </div>
    <div class="bt" id="bt_about">
        <img src="./tex/about.png" alt="">
    </div>
    <div id="start_panel">
        <h1><span id="t1"></span><br><span id="t2"></span><br><span id="t3"></span></h1>
        <p class="qr pc noanti" style="opacity: 1;">
            <img src="./tex/qr.png">
        </p>
    </div>
    <div id="about">
        <div id="center">
            <h2>DIMENSIONAL RIFT</h2>
            <h3>created by <a href="/">KIPKIPS</a> (<a href="https://github.com/KIPKIPS/KIPKIPS.github.io/tree/master/rift" target="_blank">code</a>)</h3>
            <p id="hide_ui">
                <span id="box">
                    <span id="inner_box"></span>
                </span>
                <span id="text">Invisible UI</span>
            </p>
            <p id="switch_camera">
                <span id="box">
                    <span id="inner_box"></span>
                </span>
                <span id="text">Front Camera</span>
            </p>
            <p class="desc">
                <span>Draw various graphics.</span><br>
                <span>Tap screen to refresh graphics.</span><br><br>
                <span>Record using a screen recording application.</span>
                <br><br><br><span id="version"></span>
            </p>
        </div>
        <img id="bt_close_about" src="./tex/bt_close_about.png" alt="">
    </div>

</body>

</html>